/* eslint-disable no-unused-vars */
/* eslint-disable no-shadow */
/* eslint-disable no-underscore-dangle */
/* eslint-disable no-param-reassign */
/* eslint-disable no-unused-expressions */
import Vue from 'vue';
import ElementUI from 'element-ui';
import AddressAddDialogComponent from './address-add.dialog.component.vue';
import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);

// eslint-disable-next-line import/prefer-default-export
export class AddressAddDialogService {
  // fetcher = () => {};

  // eslint-disable-next-line class-methods-use-this
  createElement() {
    const element = document.createElement('div');
    document.body.appendChild(element);
    return element;
  }

  constructor(fetcher) {
    this.fetcher = fetcher;
  }

  create({ title, confirmButtonClickHandler, data } = {}) {
    title || (title = '新增收货地址');
    confirmButtonClickHandler || (confirmButtonClickHandler = (_ = {}) => {});
    const App = Vue.extend(AddressAddDialogComponent);
    return (() => {
      const _this = this;
      return {
        mount() {
          const vm = new App({
            propsData: {
              title,
              data: data || {},
              visible: true,
              fetcher: _this.fetcher
            }
          });
          const element = _this.createElement();
          const destroy = () => {
            const element = vm.$el;
            if (element.parentNode) {
              element.parentNode.removeChild(element);
            }
          };
          vm.$on('destroy', destroy);
          vm.$on('confirm', confirmButtonClickHandler);
          vm.$mount(element);
          return {
            unmount: () => {
              destroy();
              return this;
            }
          };
        }
      };
    })();
  }
}
